<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>百科详情</title>
    <link rel="stylesheet" href="css/header.css" media="screen" title="no title">
    <link rel="stylesheet" href="css/cyclopedia.css" media="screen" title="no title">
    <link rel="stylesheet" href="css/animalShow.css" media="screen" title="no title">
    <script src="js/jquery-3.1.0.js" charset="utf-8"></script>
  </head>
  <body>
    <div class="header">
        <div class="head">
            <ul class="firstHead">
                <li><a href="index.html" target="_blank">波奇首页</a></li>
                <li><a href="shop.html" target="_blank">波奇商城</a></li>
                <li><a href="serve.html" target="_blank">波奇服务</a></li>
                <li><a href="message.html" target="_blank">波奇论坛</a></li>
                <li><a href="cyclopedia.html" target="_blank">宠物百科</a></li>
            </ul>
            <ul class="attention">
                <li><a href="#">关注我们<span><img src="" alt="" /></span></a></li>
                <li><a href="#">帮助中心</a></li>
                <li><a href="#"><span><img src="" alt="" /></span>收藏</a></li>
            </ul>
            <ul class="register">
                <li><a href="login.html" target="_blank">登陆</a></li>
                <li><a href="script:;">|</a></li>
                <li><a href="register.html" target="_blank">免费注册</a></li>
            </ul>
            <ul class="userLogin">
                <li>
                    <a href="script:;" id="userName"></a>
                </li>
                <li>|</li>
                <li><a href="script:;" id="quit">退出</a></li>
            </ul>

        </div>
    </div>
    <div class="navigation">
      <div class="logo">
        <img src="source/images/logo_baike.gif" alt="" />
      </div>
      <div class="serch">
          <input id="keyword" type="text" name="name" value="" placeholder="请输入关键字">
          <img id="search" src="source/images/ind_sch.png" alt="" />
      </div>
      <div class="app">
        <a href="#"><img src="source/images/app.jpeg" alt="" /></a>
      </div>
    </div>
    <div class="nav">
      <ul>
        <li><a href="#">首页</a></li>
        <li><a href="#">狗狗</a></li>
        <li><a href="#">猫咪</a></li>
        <li><a href="#">小宠</a></li>
        <li><a href="#">水族</a></li>
        <li><a href="#">爬虫</a></li>
      </ul>
    </div>
    <div class="content">
       <div class="content_nav">
         <p>
           <span><a href="#">首页</a>></span><span><a href="#">宠物大全</a>></span><span class="name"></span>
         </p>
       </div>
       <h2 class="name"></h2>
       <div class="content_top">
         <div class="top_left">
           <dl class="animalInformation">
             <dt>基本信息</dt>
             <dd><span>英文名:</span><em id="engname"></em></dd>
             <dd><span>性格:</span><em id="nature"></em></dd>
             <dd><span>祖籍:</span><em id="ancestralHome"></em></dd>
             <dd><span>易患病:</span><em id="disease"></em></dd>
             <dd><span>寿命:</span><em id="life"></em></dd>
             <dd><span>价格:</span><em id="price"></em></dd>
           </dl>
         </div>
         <div class="top_right">
            <div style="width:100%">
              <img class="img" style="width:100%"src="" alt="" />
            </div>
         </div>
       </div>
       <div class="content_matter">
         <div class="content_auto">
           <h2><span>1</span><span class="name">品种简介</span></h2>
           <div class="jianjie">
             <div class="title_img">
               <img class="img" src="" alt="" />
               <span class="name"></span>
             </div>
             <div class="character1 character">
               <p>金毛巡回猎犬（Golden Retriever），原产于苏格兰，祖先有雪达犬血统，因有较强的游泳能力，并能把猎物从水中叼回给主人，故最初用作狩猎及巡回被枪猎射落的水鸟，AKC分类属于运动犬组。</p>
               <p>中文学名：金毛寻回猎犬</p>
               <p>拉丁学名：Golden Retriever</p>
               <p>别称：金毛、金毛犬、黄金猎犬</p>
               <p>界：动物界</p>
               <p>门：脊索动物</p>
               <p>亚门：脊椎动物</p>
               <p>纲：哺乳</p>
               <p>亚纲：哺乳</p>
               <p>科：犬</p>
               <p>犬种智商：排名第 4</p>
             </div>
           </div>
           <h2><span>2</span><span>词条相册</span></h2>
           <div class="entryPhoto">
              <ul>
                <li><img class="img"src="" alt="" /></li>
                <li><img class="img"src="" alt="" /></li>
                <li><img class="img"src="" alt="" /></li>
                <li><img class="img"src="" alt="" /></li>
              </ul>
           </div>
           <h2><span>3</span><span class="name">形态特征</span></h2>
           <div class="jianjie">
             <div class="title_img">
               <img class="img" src="" alt="" />
               <span class="name"></span>
             </div>
             <div class="character2 character">
               <p>金毛犬在犬的智商中排名在第四位，由于金毛犬有着一双温柔的眼睛、微笑的脸庞、天使般完美的性格、一身笼罩着天堂光辉的金色被毛，目前多被用作家庭犬及导盲犬。美国犬业俱乐部(American Kennel Club,AKC)标准规定其毛皮是“丰富的，有光泽的由不同层次的金色(rich，lustrous golden of various shades)”，不允许有过于浅或者过于深的颜色。</p>
               <p>它本身分为淡奶油(色素不够)及深咖啡二大类的颜色。</p>
               <p>金毛寻回犬主要的换毛期为一年二次，但由于体积较大毛量比小型犬多，常被误认为很会掉毛，无论大型犬或小型犬都会掉毛，平时的掉毛只是每天的新陈代谢而已，只要常常为它梳毛就可减少这困扰</p>
               <p>金毛是一个均称、有力、活泼的犬种，学名为金毛寻回猎犬，稳固、身体各部位配合合理，腿既不太长也不笨拙，表情友善，个性热情、机警、自信。因其是一种猎犬，在困苦的工作环境中才能表现出他的本质特点。他的总体外貌、平衡、步态和该犬种的用途应得到比身体任何一个单独部分更多的重视。</p>
               <p>缺陷：任何与该犬种的理想描述相背离均可视为缺陷，缺陷的严重程度根据其与该犬种的用途相矛盾或与该犬种的特质相悖的程度决定。</p>
               <p>失格条件</p>
               <p>1.身高低于或高于标准身高的2.5m</p>
               <p>2.牙齿呈上腭式突出或下腭式突出。</p>
               <p>3.胸部有大量白毛或白斑。</p>
             </div>
           </div>
           <h2><span>4</span><span class="name">性格特征</span></h2>
           <div class="jianjie">
             <div class="title_img">
               <img class="img" src="source/baikeimg/2-8.jpg" alt="" />
               <span class="name"></span>
             </div>
             <div class="character3 character">
               <p>在很多家庭中，人们对金毛犬的大概认识就是金毛犬性格活泼、爱撒娇、忠诚、憨厚，我么在玩耍的时候都可以看到他的踪影，他对任何人都友善，可以和人类成为好朋友，因为他的好脾气以及聪明的脑袋，现在已有很多金毛犬被训练成导盲犬，为人类做贡献。</p>
               <p>性格特点</p>
               <p>玩耍</p>
               <p>狗儿忙碌地不断将东西捡回来，最擅长的就是捡拖鞋、鞋子、球和布娃娃的等等。最喜欢的玩具是球形玩具。来到饲主的身边，抬起一条腿，吸引饲主的注意力，或是飞奔过来，和饲主撒娇，要求一起玩耍。会“哼、哼”的用鼻音撒娇，在饲主的周围不断绕圈子，或是一看到什么东西，就立刻咬在嘴里，跑向饲主；即使是</p>
               <p>一大块枯木也不放过。</p>
               <p>撒娇</p>
               <p>发出“哼，哼”带着鼻音的撒娇声，身体不断靠近，希望饲主可以抚摸它。它会穿过饲主的跨下，或是露出肚子躺下向饲主“耍赖”。这种时候，不要凶巴巴的把它赶走，即使只有片刻，也努力和它保持肢体接触。这样可使它感受到饲主的爱。</p>
               <p>寂寞</p>
               <p>刚离开母亲的小狗或是一直独自留在家里时，就会“呜~~呜~~”的叫着。垂着肩膀，低着头，全身无力的站在它的“地盘”。即使有球滚过来，也不会看一眼。“呼”的叹一个气，努力想要使自己睡一觉。这种时候，只有饲主的爱才能给它温柔</p>
               <p>服从</p>
               <p>狗对自己认同的首领会完全服从。爱犬的主人当然就是饲主，它只会对自己的主人做出仰躺，露出最大弱点的肚子这种毫无防备的动作，代表自己完全没有反抗的意思，是绝对服从的信号。另外，尾巴向后伸直，将腹部趴在地面，塌着耳朵，哀怨的抬头看着饲主时，代表服从的意思</p>
             </div>
           </div>
         </div>
       </div>
    </div>
    <div class="footer">
       <ul>
         <li><a href="#">关于我们</a></li>|
         <li><a href="#">友情链接</a></li>|
         <li><a href="#">诚聘英才</a></li>|
         <li><a href="#">联系我们</a></li>|
         <li><a href="#">网站地图</a></li>|
         <li><a href="#">意见反馈</a></li>|
         <li><a href="#">帮助中心</a></li>|
         <li><a href="#">客服热线：123456789</a></li>
       </ul>
       <p>
         Copyright © 2007-2016 Boqii.com All Rights Reserved 光橙（上海）信息科技有限公司 版权所有 沪ICP备13034501号-2 增值电信业务经营许可证：沪B2-20140120
       </p>
       <p class="href">
          <a href="http://www.sgs.gov.cn/"><img src="source/images/foot_gs.png" alt="" /></a>
          <a href="#"><img src="source/images/foot_cx.png" alt="" /></a>
          <a href="#"><img src="source/images/foot_kx.png" alt="" /></a>
          <a href="#"><img src="source/images/foot_zx.png" alt="" /></a>
       </p>
    </div>
  </body>
</html>
<script type="text/javascript">


var register = document.getElementsByClassName("register")[0];
var userLogin =document.getElementsByClassName("userLogin")[0];
var userName = document.getElementById("userName");
var quit = document.getElementById("quit");
window.ready = readStorage();
setInterval(readStorage,2000);
//读取storage的数据
function readStorage(){
  var storage = window.localStorage;
  if (typeof(storage["user"])=='undefined') {
    register.style.display ="inline-block";
    userLogin.style.display = "none";
     return false;
  }else if(storage["user"]==""){
    register.style.display ="inline-block";
    userLogin.style.display = "none";
     return false;
  }else {
    var myDate =  new Date();
    var currenTime = myDate.getTime();
    if (currenTime >= Number(storage["userTime"])+3600000) {
      storage["user"] =="";
    }else {
        register.style.display ="none";
        userLogin.style.display = "inline-block";
        userName.innerText = storage["user"];
    }

  }
}
quit.onclick = function (){
  var storage = window.localStorage;
  register.style.display ="inline-block";
  userLogin.style.display = "none";
  storage["user"] = "";
}




var name=window.location.search.slice(window.location.search.lastIndexOf("?")+1);
var XMLHttp
if (window.ActiveXObject) {
  XMLHttp = new ActiveXObject('Microsoft.XMLHTTP');
}else{
  XMLHttp = new XMLHttpRequest();
}
var url = "php/animalShow.php?name="+name;
  console.log(url);
XMLHttp.open('get',url,true);
XMLHttp.send(null);
XMLHttp.onreadystatechange = function () {
  if (XMLHttp.readyState == 4) {
    if (XMLHttp.status == 200) {
      obj = JSON.parse(XMLHttp.response);
      console.log(obj);
      var name = document.getElementsByClassName("name");
      for (var i = 0; i < name.length; i++) {
        name[i].innerText = obj.name+name[i].innerText;
        console.log(name[i].innerText);
      }
      var img = document.getElementsByClassName("img");
        img[0].src = obj.imgurl1;
        img[1].src = obj.imgurl2;
        img[2].src = obj.imgurl3;
        img[3].src = obj.imgurl4;
        img[4].src = obj.imgurl5;
        img[5].src = obj.imgurl6;
        img[6].src = obj.imgurl7;
        img[7].src = obj.imgurl8;
      var engname = document.getElementById("engname");
      var nature = document.getElementById("nature");
      var ancestralHome = document.getElementById("ancestralHome");
      var disease = document.getElementById("disease");
      var life = document.getElementById("life");
      var price = document.getElementById("price");
      engname.innerText = obj.engname;
      nature.innerText = obj.nature;
      ancestralHome.innerText = obj.ancestralHome;
      disease.innerText = obj.disease;
      life.innerText = obj.life;
      price.innerText= obj.price;
      $(".character1").load('data.html #'+obj.wrap+1);
      $(".character2").load('data.html #'+obj.wrap+2);
      $(".character3").load('data.html #'+obj.wrap+3);
    }
  }
}
var keyword = document.getElementById("keyword");
var search = document.getElementById("search");
search.onclick = function () {
  if (!keyword.value) {
    keyword.focus();
  }else{
    window.open('wares.html?'+keyword.value);
  }
}
</script>
